<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
    <title>用户管理</title>
    <link rel="stylesheet" href="css/common.css">
    <link rel="stylesheet" href="css/usermanager.css">
    <!-- 引入第三方库 -->
    <script src="libs/jquery-3.6.0.min.js"></script>
    <script src="libs/layui/layui.js"></script>
    <!-- 引入公共模块 -->
    <script src="js/common.js"></script>
    <script src="js/widgets.js"></script>
    <script src="js/android-interface.js"></script>
    <!-- 引入模拟数据 -->
    <script src="js/mock/mock-user-data.js"></script>
    <!-- 引入业务模块 -->
    <script src="js/usermanager.js"></script>
</head>
<body>
    <!-- 页面头部 -->
    <div class="common-header"></div>
    
    <!-- 主内容区 -->
    <div class="main-container">
        <!-- 用户管理工具栏 -->
        <div class="toolbar">
            <div class="search-box">
                <input type="text" id="user-search" placeholder="搜索用户名、姓名或登录时间">
                <i class="layui-icon layui-icon-search"></i>
            </div>
            <button id="add-user-btn" class="btn-primary">
                <i class="layui-icon layui-icon-add-1"></i>添加用户
            </button>
        </div>
        
        <!-- 用户列表 -->
        <div id="user-list" class="user-list-container">
            <!-- 用户列表将通过JavaScript动态加载 -->
        </div>
    </div>
    
    <!-- 页面底部 -->
    <div class="common-footer">
        <p>© <span id="current-year"></span> 智慧粮仓管理系统</p>
    </div>
    
    <script>
        // 初始化页面头部
        $(document).ready(function() {
            // 设置页面标题
            initCommonHeader('用户管理');
            
            // 设置当前年份
            document.getElementById('current-year').textContent = new Date().getFullYear();

            window.UserManager.init();
        });
    </script>
</body>
</html> 